<template>
  <!---->
  <div id="hwDetail" class="sceneDetail">
    <!--<Row :style="{'margin-bottom':'10px'}">
    场景:
    <Select filterable v-model="drill" style="width:200px" @on-change="getCurDrill">
          <Option v-for="item in drillSecensList" :value="JSON.stringify(item)" :key="item.drillitemid">{{ item.drillitemname }}</Option>
     </Select>
     <span v-if="projectId">
     <span>演练模式</span> <Tag color="blue">{{ project.drillmode | filterMode}}</Tag>
     <span>类型</span> <Tag color="blue">{{ project.type | typeFilter}}</Tag>
     </span>
    </Row>-->
    <!--<Breadcrumb style="margin-bottom: 22px">
        <BreadcrumbItem :to="backObj">演练列表</BreadcrumbItem>
        <BreadcrumbItem>{{drillDetail.name}}</BreadcrumbItem>
      </Breadcrumb>-->
    <!-- <div style="color: rgb(27, 76, 184); margin-bottom: 15px">
          <div class="addressIcon"></div>
          <span>当前位置：</span> -->
    <!-- 护网演练 -->
    <!-- <span style="cursor: pointer" @click="returnPage">{{ title }}</span>
          <Icon type="ios-arrow-forward" color="rgb(27, 76, 184)" size="16" />
          <span style="color: #333">{{ drillDetail.name }}</span>
      </div> -->
    <div style="margin-bottom: 20px" class="sceneStep">
      <template>
        <div class="step-group">
          <Steps :current="currentIndex" direction="vertical" style="width: 100%">
            <Step
              title="演练前设置"
              @click.native="toPreCompeManage"
              content="提供演练前演练团队、目标、成员的管理"
              :class="{ curStep: drillStatus == 1 }"
              :icon="drillStatus == 1 ? 'ios-refresh-circle' : ''"
            ></Step>
            <Step
              :title="'演练中管理' + (drillDetail.progress == 5 ? '(已暂停)' : '')"
              @click.native="toCompeingManage"
              content="提供演练过程中的控制,比如开启关闭演练、修改题目信息、对题目显示隐藏的控制、团队禁赛恢复演练、演练过程中答题情况的监控等"
              :class="{ curStep: drillStatus == 2 }"
              :icon="drillStatus == 2 ? 'ios-refresh-circle' : ''"
            ></Step>
            <Step
              title="演练后归档"
              @click.native="toCompeedManage"
              content="提供演练后选手成绩的管理和统计"
              :class="{ curStep: drillStatus == 3 }"
              :icon="drillStatus == 3 ? 'ios-refresh-circle' : ''"
            ></Step>
          </Steps>
          <p
            style="color: #f00"
            v-if="projectInfo.status == 3 && drillDetail.progress == 4 && endClearConfig"
          >
            【您的环境将于<Time
              :time="destoryTime"
              type="datetime"
            />时自动回收，若仍需保留，请在回收前重新开始配置演练】
          </p>
          <template v-if="vpn == '1212'">
            <p
              style="color: #f00"
              v-if="projectInfo.status == 3 && drillDetail.progress == 4 && allowChangeIp"
            >
              【演练已结束，是否清除公网IP，如果不清除仍会持续产生费用。如果依然不清除，将于<Time
                :time="destoryTime"
                type="datetime"
              />时与环境一起自动清除。】
            </p>
          </template>
        </div>
      </template>
      <div class="countdown" v-if="drillDetail.progress != 4">
        <template v-if="drillDetail.progress != 5">
          <span v-if="drillStatus == 1">开始</span
          ><span v-if="drillStatus != 1">结束</span>倒计时：<b>
            <span>{{ time.h }}</span
            >:<span>{{ time.m }}</span
            >:<span>{{ time.s }}</span></b
          >
        </template>
        <strong v-else> 暂停中 </strong>
      </div>
      <!--<div style="display:flex;justify-content: space-between;">-->
      <div class="btn-group">
        <!--<span style="color:#f00;" v-if="projectInfo.status == 3 && drillDetail.progress == 4">【您的环境将于<Time :time="destoryTime" type="datetime" />时自动回收，若仍需保留，请在回收前重新开始配置比赛】</span>-->
        <div class="flex">
          <Poptip
            confirm
            title="确定要释放本次比赛的资源吗？如果确定本次比赛的结果已经统计完毕,请继续."
            @on-ok="clearProject()"
            style="margin-right: 5px"
            transfer
            word-wrap
            width="250"
          >
            <Button type="primary" :ghost="destoryProject()" :disabled="destoryProject()">
              <img src="../../assets/scene/dis-not-deploy.png" alt="" v-if="destoryProject()" />
              <img src="../../assets/scene/not-deploy.png" alt="" v-else />
              <span
                v-if="
                  projectInfo.status == 14 || projectInfo.status == 3 || !projectInfo.statusCHName
                "
              >
                <span v-if="projectInfo.statusCHName">释放资源</span>
                <span v-else>工程不存在</span>
              </span>
              <span v-else>{{ projectInfo.statusCHName }}</span>
            </Button>
          </Poptip>
          <!-- <Poptip
                      confirm
                      title="为确保可视化展示效果，建议使用chrome浏览器查看大屏。"
                      @on-ok="showVisualization()"
                      transfer
                      word-wrap
                      width="250"
                  >
                      <Button type="primary">
                          <img src="../../assets/scene/dis-screen.png" />可视化展示
                      </Button>
                  </Poptip> -->
          <Poptip
            confirm
            title="为确保可视化展示效果，建议使用chrome浏览器查看大屏。"
            @on-ok="showVisualization1()"
            transfer
            word-wrap
            width="250"
          >
            <Button type="primary">
              <img src="../../assets/scene/dis-screen.png" />可视化展示
            </Button>
          </Poptip>
          <!-- 不再展示一键配置外网IP -->
          <!-- <Button  type="primary" icon="ios-options" :disabled="hasOperatingRecord || !hasTeam"
              @click="outerNetModal = true; outerNetFrom.showSwitchNum = true; outerNetFrom.showBandwidth = true;" v-if="allowChangeIp">
            一键配置外网ip</Button> -->
          <Poptip
            confirm
            title="确定要开始演练？"
            @on-ok="getTaskList('2')"
            transfer
            v-if="drillDetail.progress != 4"
            word-wrap
          >
            <Button
              type="primary"
              :ghost="startContestStatus || disabledAllBtn || disStartCompete"
              :disabled="startContestStatus || disabledAllBtn || disStartCompete"
            >
              <img
                src="../../assets/scene/dis-start-scene.png"
                alt=""
                v-if="startContestStatus || disabledAllBtn || disStartCompete"
              />
              <img src="../../assets/scene/start-scene.png" alt="" v-else />开始演练</Button
            >
          </Poptip>
          <Button
            type="primary"
            @click="showModal()"
            v-if="drillDetail.progress == 4"
            :ghost="disabledAllBtn"
            :disabled="disabledAllBtn"
          >
            <img src="../../assets/scene/dis-start-scene.png" alt="" v-if="disabledAllBtn" />
            <img src="../../assets/scene/start-scene.png" alt="" v-else />重新开始演练</Button
          >
          <Button
            type="primary"
            @click="showDelayModal()"
            v-if="drillStatus == 2"
            :ghost="disabledAllBtn || disStartCompete"
            :disabled="disabledAllBtn || disStartCompete"
          >
            <img
              src="../../assets/scene/dis-delay.png"
              alt=""
              v-if="disabledAllBtn || disStartCompete"
            />
            <img src="../../assets/scene/delay.png" alt="" v-else />延迟演练</Button
          >
          <Poptip
            confirm
            title="确定要重置环境？"
            @on-ok="resetEnviron()"
            transfer
            v-if="drillDetail.progress == 4 && cloudType !== 'h3c'"
            word-wrap
          >
            <Button
              type="primary"
              :ghost="disabledAllBtn || resetStatus == 1"
              :disabled="disabledAllBtn || resetStatus == 1"
            >
              <template v-if="resetStatus == 1">
                <Progress
                  :percent="resetProgress"
                  :stroke-width="10"
                  style="width: 90px"
                  v-if="resetStatus == 1 && drillDetail.progress == 4"
                >
                  <span>重置{{ resetProgress }}%</span>
                </Progress>
                <!--<Icon type="ios-information-circle-outline" :size="20" v-if="resetStatus == 2"/>-->
                <!--<p>正在重置环境...</p>-->
              </template>
              <template v-else>
                <img
                  src="../../assets/scene/dis-reset-network.png"
                  alt=""
                  height="16"
                  v-if="disabledAllBtn"
                />
                <img src="../../assets/scene/reset-network.png" alt="" height="16" v-else />重置环境
              </template>
              <!--{{resetStatus}}-->
              <Icon
                type="ios-information-circle-outline"
                :size="16"
                @click.stop="getResetDetail"
                v-if="resetFail"
                style="vertical-align: text-bottom"
              />
            </Button>
          </Poptip>
          <Poptip confirm title="确定要结束演练？" @on-ok="getTaskList('4')" transfer word-wrap>
            <Button
              type="primary"
              :ghost="stopContestStatus || disabledAllBtn"
              :disabled="stopContestStatus || disabledAllBtn"
            >
              <img
                src="../../assets/scene/dis-stop-scene.png"
                alt=""
                v-if="stopContestStatus || disabledAllBtn"
              />
              <img src="../../assets/scene/stop-scene.png" alt="" v-else />结束演练</Button
            >
          </Poptip>
          <Poptip
            confirm
            title="确定要暂停演练？"
            @on-ok="pauseCompetition"
            transfer
            v-if="drillDetail.progress != 5"
            word-wrap
          >
            <Button
              type="primary"
              :ghost="drillDetail.progress != 2 || disabledAllBtn"
              :disabled="drillDetail.progress != 2 || disabledAllBtn"
            >
              <img
                src="../../assets/scene/dis-pause-scene.png"
                alt=""
                v-if="drillDetail.progress != 2 || disabledAllBtn"
              />
              <img src="../../assets/scene/pause-scene.png" alt="" v-else />暂停演练</Button
            >
          </Poptip>
          <Poptip
            confirm
            title="确定要恢复演练？"
            @on-ok="restoreCompetition"
            transfer
            v-if="drillDetail.progress == 5 || disabledAllBtn"
            word-wrap
          >
            <Button
              type="primary"
              :ghost="drillDetail.progress != 5"
              :disabled="drillDetail.progress != 5 || disabledAllBtn"
            >
              <img
                src="../../assets/scene/dis-recover-scene.png"
                alt=""
                v-if="drillDetail.progress != 5 || disabledAllBtn"
              />
              <img src="../../assets/scene/recover-scene.png" alt="" v-else />恢复演练</Button
            >
          </Poptip>
          <Button type="primary" @click="boardModal = true">
            <img src="../../assets/scene/dis-boardcast.png" alt="" />发送公告</Button
          >
          <Button type="primary" @click="gotoReportPage" v-if="drillDetail.progress == 4">
            <img src="../../assets/scene/btn-report.png" />报告</Button
          >
          <Poptip
            confirm
            title="确定要清空场景公告及聊天消息？"
            @on-ok="clearSceneNoticeAndChat()"
            transfer
            word-wrap
          >
            <Button type="primary">清空场景公告及聊天信息</Button>
          </Poptip>
          <Button type="primary" @click="gotoFlowAnalysis" v-if="false">
            <!-- <img src="../../assets/mainPage/flowAnalysis-icon-active-s.png" /> -->
            离线分析
          </Button>
          <Button type="primary" @click="downloadReport()"> 下载统计信息 </Button>
          <!--<Button type="warning" v-if="drillDetail.progress != 4"><span v-if="drillStatus == 1">开始</span><span v-if="drillStatus != 1">结束</span>倒计时：<span><span>{{time.h}}</span>:<span>{{time.m}}</span>:<span>{{time.s}}</span></span></Button>-->
          <!--compReportModal = true-->
          <Button
            type="primary"
            @click="handleGoCircumstances"
            v-if="$store.state.common.sysConfig.modeConfig != '1'"
            >进入环境</Button
          >
        </div>
        <div style="margin-top: 5px">
          <span style="color: #ff9900; font-size: 14px"
            ><Icon
              type="ios-information-circle-outline"
              :size="16"
            />开始演练前请先完成团队人员配置和目标分配,如果已经完成配置,开始按钮不可点,请点击</span
          ><a @click="validateStart" :disabled="notOwn" style="font-size: 14px">校验</a>
        </div>
        <div style="margin-top: 5px" v-if="notOwn">
          <span style="color: #ff9900; font-size: 14px"
            ><Icon
              type="ios-information-circle-outline"
              :size="16"
            />非本人创建的演练项目无法校验</span
          >
        </div>
        <div style="margin-top: 5px">
          <span style="color: #ff9900; font-size: 14px"
            ><Icon
              type="ios-information-circle-outline"
              :size="16"
            />如果比赛环境已经被改变，“重新开始演练”前请先“重置环境”</span
          >
        </div>
        <ChatRoom v-if="!notOwn" :drillId="drillid" class="btn-chat" ref="chatRoom"></ChatRoom>
      </div>
      <!--</div>-->
    </div>
    <div class="span-group">
      <span style="margin-right: 10px">
        配置模式：<Tag color="blue">{{ configMode === 1 ? '简单模式' : '复杂模式' }}</Tag>
        <Poptip
          confirm
          :title="configModeTitle"
          :disabled="disabledAllBtn"
          @on-ok="changeConfigMode"
        >
          <Button
            type="primary"
            shape="circle"
            icon="md-repeat"
            style="padding: 0"
            :disabled="disabledAllBtn"
            size="small"
          ></Button>
        </Poptip>
      </span>

      <span v-if="allowChangeIp && vpn == '1212'" style="margin-right: 10px">
        团队可重置的外网ip次数：<Tag color="blue">{{ switchNum }}</Tag>
        <Button
          type="primary"
          shape="circle"
          icon="md-repeat"
          @click="
            outerNetModal = true
            outerNetFrom.showSwitchNum = true
            outerNetFrom.showBandwidth = false
          "
          style="padding: 0"
          size="small"
        ></Button>
      </span>
      <span v-if="allowChangeIp && vpn == '1212'" style="margin-right: 10px">
        带宽（M）：<Tag color="blue">{{ maxBandwidth }}</Tag>
        <Button
          type="primary"
          shape="circle"
          icon="md-repeat"
          @click="
            outerNetModal = true
            outerNetFrom.showSwitchNum = false
            outerNetFrom.showBandwidth = true
          "
          style="padding: 0"
          size="small"
        ></Button>
      </span>
      <span style="margin-right: 10px">
        靶标下线后攻击方可提交报告时长：<Tag color="blue">{{ atTime }}（小时）</Tag>
        <Button
          type="primary"
          shape="circle"
          icon="md-repeat"
          @click="
            reportTimeModal = true
            $refs.reportTimeFrom.resetFields()
            outerNetFrom.timeType = 'at'
            outerNetFrom.time = atTime
          "
          style="padding: 0"
          size="small"
        ></Button>
      </span>
      <span style="margin-right: 10px">
        靶标下线后防守方可提交报告时长：<Tag color="blue">{{ deTime }}（小时）</Tag>
        <Button
          type="primary"
          shape="circle"
          icon="md-repeat"
          @click="
            reportTimeModal = true
            $refs.reportTimeFrom.resetFields()
            outerNetFrom.timeType = 'de'
            outerNetFrom.time = deTime
          "
          style="padding: 0"
          size="small"
        ></Button>
      </span>
      <span style="margin-right: 10px">
        报告/申报提交频率：<Tag color="blue"
          >（{{ submitTime }}分钟）内仅可提交 （{{ submitCount }}次）</Tag
        >
        <Button
          type="primary"
          shape="circle"
          icon="md-repeat"
          @click="openSubmitFrequencyModal"
          style="padding: 0"
          size="small"
        ></Button>
      </span>
      <span v-if="allowChangeIp && vpn == '1211'" style="margin-right: 10px">
        团队公网ip数:<Tag color="blue">{{ ipNumber }}</Tag>
        <Button
          type="primary"
          shape="circle"
          icon="md-repeat"
          :disabled="disabledAllBtn"
          @click="teamModal = true"
          style="padding: 0"
          size="small"
        ></Button>
      </span>
      <span style="margin-right: 10px">
        演练结束后24小时是否自动销毁环境：<Tag color="blue">{{ endClearConfigShow }}</Tag>
        <Poptip
          confirm
          :title="changeEndClearConfigTip"
          :disabled="disChangeEndClearConfig"
          @on-ok="changEndClearConfig()"
        >
          <Button
            type="primary"
            shape="circle"
            icon="md-repeat"
            style="padding: 0"
            :disabled="disChangeEndClearConfig"
            size="small"
          ></Button>
        </Poptip>
      </span>
      <span v-if="allowChangeIp && vpn == '1211'" style="margin-right: 10px">
        可用公网ip数:<Tag color="blue">{{ usableNumber }}</Tag>
      </span>
    </div>

    <!-- 赛前 -->
    <Tabs
      class="demo-tabs-style2"
      @on-click="changePreTab"
      v-if="preCompeManagePanelShow"
      v-model="preDefault"
    >
      <TabPane label="演练团队管理" name="accessGroup" key="pre-accessGroup" :index="1">
        <AccessUserToGroup
          v-if="preDefault == 'accessGroup'"
          :type="5"
          :hwType="2"
          ref="accessUserToGroup"
          :configMode="configMode"
          @add-data="getTeamList"
          @del-data="getTeamList"
          :allowChangeIp="allowChangeIp"
          :disabledAllBtn="disabledAllBtn"
          :showBtn="false"
        ></AccessUserToGroup>
      </TabPane>
      <TabPane
        label="接入机器分配"
        name="accessVm"
        key="pre-accessVm"
        :index="2"
        v-if="parsedVmInEnable"
      >
        <AccessVmToUser
          :configMode="configMode"
          v-if="preDefault == 'accessVm'"
          :type="5"
          :disabledAllBtn="disabledAllBtn"
        ></AccessVmToUser>
      </TabPane>
      <TabPane label="演练目标配置" name="targetTeam" key="pre-targetTeam" :index="3">
        <TargetTeam
          :configMode="configMode"
          v-if="preDefault == 'targetTeam'"
          :disabledAllBtn="disabledAllBtn"
          :allowChangeIp="allowChangeIp"
          :deployMode="deployMode"
          :hwType="hwType"
          :showAddTarget="true"
        ></TargetTeam>
      </TabPane>
      <TabPane
        label="路由规则下发记录"
        name="routerRules"
        key="pre-routerRules"
        v-if="!allowChangeIp || deployMode === 2"
        :index="4"
      >
        <RouterRules
          v-if="preDefault == 'routerRules'"
          :disabledAllBtn="disabledAllBtn"
          :hwType="hwType"
        ></RouterRules>
      </TabPane>
      <TabPane label="目标分配" name="targetAllot" key="pre-targetAllot" :index="6">
        <TargetAllot
          @add-data="canStartCompete(drillDetail.type)"
          @update-data="canStartCompete(drillDetail.type)"
          @delete-data="canStartCompete(drillDetail.type)"
          v-if="preDefault == 'targetAllot'"
          :disabledAllBtn="disabledAllBtn"
        ></TargetAllot>
      </TabPane>
      <!-- <TabPane label="基础分配置" name="basicScoreConfig" key="pre-basic-score-config" :index="7">
      <BasicScoreConfig
        v-if="preDefault == 'basicScoreConfig'"
        :drillStatus="drillStatus"
        :disabledAllBtn="disabledAllBtn"
        :type="5"
      ></BasicScoreConfig>
    </TabPane> -->
      <TabPane label="计分规则" name="scoreRule" key="scoreRule" :index="8">
        <ScoreRule
          v-if="preDefault == 'scoreRule'"
          :configMode="configMode"
          :disabledAllBtn="disabledAllBtn"
          :typeExcel="5"
        ></ScoreRule>
      </TabPane>
      <TabPane label="报告持续提交" name="reportCommitLoop" key="pre-reportCommitLoop" :index="9">
        <ReportCommitLoop
          :configMode="configMode"
          v-if="preDefault == 'reportCommitLoop'"
          :disabledAllBtn="disabledAllBtn"
        ></ReportCommitLoop>
      </TabPane>
      <!-- <TabPane
              label="流量过滤"
              name="flow"
              key="pre-flow"
              :index="10"
              v-if="optionConfig && optionConfig.hwFlowFilter == 1"
          >
              <Flow v-if="preDefault == 'flow'" :type="5"></Flow>
          </TabPane> -->
      <TabPane label="环境管理" name="environManage" key="pre-environManage" :index="11">
        <!--<Alert>提供的功能：提供参赛团队的提交flag记录，提供正确提交的撤销和恢复撤销。</Alert>-->
        <EnvironManage v-if="preDefault == 'environManage'"></EnvironManage>
      </TabPane>
      <!-- 数据通道、外网可切的模式不会下发规则，不需要展示答题环境路由配置 -->
      <!-- <TabPane label="答题环境路由配置" name="distributeRouter" key="pre-distributeRouter" :index="10"
      v-if="!(deployMode === 1 && allowChangeIp)">
              <DistributeRouter v-if="preDefault == 'distributeRouter'" :disabledAllBtn="disabledAllBtn" :type="5" :projectInfo="project"></DistributeRouter>
          </TabPane> -->
      <TabPane
        label="外网分配管理"
        name="assignNetwork"
        v-if="allowChangeIp && vpn == '1212'"
        key="pre-assignNetwork"
        :index="12"
      >
        <AssignNetwork
          v-if="preDefault == 'assignNetwork'"
          :type="5"
          @add-data="getOperatingRecordList"
          @del-data="getOperatingRecordList"
          :disabledAllBtn="disabledAllBtn"
        ></AssignNetwork>
      </TabPane>
      <TabPane
        label="外网分配管理"
        name="teamStatistics"
        v-if="allowChangeIp && vpn == '1211'"
        key="pre-teamStatistics"
        :index="13"
      >
        <teamStatistics
          v-if="preDefault == 'teamStatistics'"
          :type="5"
          :progress="drillDetail.progress"
          :disabledAllBtn="disabledAllBtn"
          :refreshdata="refeshNumber"
        ></teamStatistics>
      </TabPane>
      <TabPane
        label="外网操作统计"
        name="networkOperatingRecord"
        v-if="allowChangeIp && vpn == '1211'"
        key="pre-networkOperatingRecord"
        :index="14"
      >
        <newNetworkOperatingRecord
          v-if="preDefault == 'networkOperatingRecord'"
          :type="5"
          :disabledAllBtn="disabledAllBtn"
        ></newNetworkOperatingRecord>
      </TabPane>
      <TabPane
        label="外网操作统计"
        name="networkOperatingRecord"
        v-if="allowChangeIp && vpn == '1212'"
        key="pre-networkOperatingRecord"
        :index="14"
      >
        <NetworkOperatingRecord
          v-if="preDefault == 'networkOperatingRecord'"
          :type="5"
          :disabledAllBtn="disabledAllBtn"
        ></NetworkOperatingRecord>
      </TabPane>
      <TabPane label="流量采集" name="trafficCollection" key="pre-trafficCollection" :index="15">
        <trafficCollection :type="5" v-if="preDefault == 'trafficCollection'"></trafficCollection>
      </TabPane>
      <TabPane label="团队VPN管理" name="teamVPN" key="pre-teamVPN" :index="16">
        <vpnManage
          :type="1"
          v-if="preDefault == 'teamVPN'"
          :testId="testId"
          :disabledAllBtn="disabledAllBtn"
        ></vpnManage>
      </TabPane>
      <TabPane label="用户VPN管理" name="userVPN" key="pre-userVPN" :index="17">
        <vpnManage
          :type="2"
          v-if="preDefault == 'userVPN'"
          :testId="testId"
          :disabledAllBtn="disabledAllBtn"
        ></vpnManage>
      </TabPane>
    </Tabs>
    <!-- 赛中 -->
    <Tabs
      class="demo-tabs-style2"
      @on-click="changeMidTab"
      v-if="compeingManagePanelShow"
      :value="midDefault"
    >
      <TabPane
        label="目标被攻击统计"
        name="targetAttackAllotStatic"
        key="mid-targetAllotStatic-attack"
      >
        <topoTargetStatic
          v-if="midDefault == 'targetAttackAllotStatic'"
          :type="5"
          :poll="true"
        ></topoTargetStatic>
        <!--:show="midDefault == 'targetTeamMid'"-->
        <!--<TargetTeamMid v-if="midDefault == 'targetTeamMid'" :type="4" :poll="true"></TargetTeamMid>-->
      </TabPane>
      <TabPane
        label="目标防守统计"
        name="targetDefendAllotStatic"
        key="mid-targetAllotStatic-defend"
      >
        <topoTargetStatic
          v-if="midDefault == 'targetDefendAllotStatic'"
          :type="5"
          :poll="true"
          :isDefend="true"
          key="mid-targetAllotStatic-defend"
        ></topoTargetStatic>
        <!--                :show="midDefault == 'targetTeamMid'"-->
        <TargetTeamMid v-if="midDefault == 'targetTeamMid'" :type="4" :poll="true"></TargetTeamMid>
      </TabPane>
      <TabPane label="攻击方排行统计" name="teamRankStatic" key="mid-teamRankStatic">
        <!--<Alert>提供的功能：提供选手团队的得分排名</Alert>-->
        <teamRankStatic v-if="midDefault == 'teamRankStatic'" :poll="true"></teamRankStatic>
      </TabPane>
      <TabPane label="防守方排行统计" name="defendRankStatic" key="mid-defendRankStatic">
        <!-- <Alert>提供的功能：提供选手团队的得分排名</Alert> -->
        <teamRankStatic
          v-if="midDefault == 'defendRankStatic'"
          :poll="true"
          :isDefend="true"
          :targetScore="targetScore"
        ></teamRankStatic>
      </TabPane>
      <TabPane label="报告统计" name="reportStatic" key="mid-reportStatic">
        <!--<Alert>提供的功能：提供选手团队的得分排名</Alert>-->
        <reportStatic
          v-if="midDefault == 'reportStatic'"
          :poll="true"
          :disabledAllBtn="disabledAllBtn"
          :drillDetail="drillDetail"
        ></reportStatic>
      </TabPane>
      <TabPane label="得分统计" name="attackSuccess" key="mid-attackSuccess">
        <!--<Alert>提供的功能：提供选手团队的得分排名</Alert>-->
        <scoreRecordStatic
          v-if="midDefault == 'attackSuccess'"
          :type="6"
          :sceneType="5"
          :hwType="hwType"
        ></scoreRecordStatic>
      </TabPane>
      <TabPane label="环境管理" name="environManage" key="mid-environManage">
        <!--<Alert>提供的功能：提供参赛团队的提交flag记录，提供正确提交的撤销和恢复撤销。</Alert>-->
        <EnvironManage v-if="midDefault == 'environManage'"></EnvironManage>
      </TabPane>
      <!-- <TabPane label="录屏回放" name="screencap" key="mid-screencap">
               <Screencap v-if ="midDefault == 'screencap'" ></Screencap>
          </TabPane> -->
      <TabPane label="选手接入机器录屏" name="tab6" v-if="parsedVmInEnable">
        <screenController v-if="midDefault == 'tab6'"></screenController>
      </TabPane>

      <TabPane
        label="外网分配管理"
        name="assignNetwork"
        v-if="allowChangeIp && vpn == '1212'"
        key="mid-assignNetwork"
      >
        <AssignNetwork
          v-if="midDefault == 'assignNetwork'"
          :type="5"
          @add-data="getOperatingRecordList"
          @del-data="getOperatingRecordList"
          :disabledAllBtn="disabledAllBtn"
        ></AssignNetwork>
      </TabPane>
      <TabPane
        label="外网分配管理"
        name="teamStatistics"
        v-if="allowChangeIp && vpn == '1211'"
        key="mid-teamStatistics"
      >
        <teamStatistics
          v-if="midDefault == 'teamStatistics'"
          :type="5"
          :progress="this.drillDetail.progress"
          :disabledAllBtn="disabledAllBtn"
          :refreshdata="refeshNumber"
        ></teamStatistics>
      </TabPane>
      <TabPane
        label="外网操作统计"
        name="networkOperatingRecord"
        v-if="allowChangeIp && vpn == '1211'"
        key="mid-networkOperatingRecord"
        :index="14"
      >
        <newNetworkOperatingRecord
          v-if="midDefault == 'networkOperatingRecord'"
          :type="5"
          :disabledAllBtn="disabledAllBtn"
        ></newNetworkOperatingRecord>
      </TabPane>
      <TabPane
        label="外网操作统计"
        name="networkOperatingRecord"
        v-if="allowChangeIp && vpn == '1212'"
        key="mid-networkOperatingRecord"
        :index="14"
      >
        <NetworkOperatingRecord
          v-if="midDefault == 'networkOperatingRecord'"
          :type="5"
          :disabledAllBtn="disabledAllBtn"
        ></NetworkOperatingRecord>
      </TabPane>
      <!-- <TabPane label="云实例管理" name="cloudInstance" v-if="allowChangeIp" key="mid-cloudInstance">
            <CloudInstance v-if="midDefault == 'cloudInstance'" :type="5" :disabledAllBtn="disabledAllBtn"></CloudInstance>
          </TabPane> -->

      <TabPane label="网络行为" name="networkBehavior">
        <networkBehavior
          v-if="midDefault == 'networkBehavior'"
          :showMonitoring="showMonitoring"
          @toTrafficRetrieval="toTrafficRetrieval"
        />
      </TabPane>
      <TabPane label="威胁事件" name="threatEvent" v-if="routerName == 'newHwDetail'">
        <threatEvent v-if="midDefault == 'threatEvent'" />
      </TabPane>
      <TabPane label="流量检索" name="trafficRetrieval" v-if="routerName == 'newHwDetail'">
        <trafficRetrieval
          v-if="midDefault == 'trafficRetrieval'"
          :trafficRetrievalParams="trafficRetrievalParams"
        />
      </TabPane>
      <TabPane label="违规行为" name="violations">
        <violations v-if="midDefault == 'violations'" />
      </TabPane>
    </Tabs>
    <!-- 归档 -->
    <Tabs
      class="demo-tabs-style2"
      @on-click="changeEndTab"
      v-if="compeedManagePanelShow"
      :value="endDefault"
    >
      <!--<TabPane label="目标统计" name="targetTeamMid">-->
      <!--:show="midDefault == 'targetTeamMid'"-->
      <!--<TargetTeamMid v-if="endDefault == 'targetTeamMid'" :type="4"></TargetTeamMid>
        </TabPane>-->
      <TabPane label="攻击方排行统计" name="teamRankStatic" key="end-teamRankStatic">
        <!--<Alert>提供的功能：提供选手团队的得分排名</Alert>-->
        <teamRankStatic v-if="endDefault == 'teamRankStatic'"></teamRankStatic>
      </TabPane>
      <TabPane label="防守方排行统计" name="defendRankStatic" key="end-defendRankStatic">
        <!--<Alert>提供的功能：提供选手团队的得分排名</Alert>-->
        <teamRankStatic
          v-if="endDefault == 'defendRankStatic'"
          :poll="true"
          :isDefend="true"
          :targetScore="targetScore"
        ></teamRankStatic>
      </TabPane>
      <TabPane label="得分统计" name="attackSuccess" key="end-attackSuccess">
        <!--<Alert>提供的功能：提供选手团队的得分排名</Alert>-->
        <scoreRecordStatic
          v-if="endDefault == 'attackSuccess'"
          :type="6"
          :sceneType="5"
        ></scoreRecordStatic>
      </TabPane>
      <TabPane label="环境管理" name="environManage" key="end-environManage">
        <!--<Alert>提供的功能：提供参赛团队的提交flag记录，提供正确提交的撤销和恢复撤销。</Alert>-->
        <EnvironManage v-if="endDefault == 'environManage'"></EnvironManage>
      </TabPane>
      <!-- <TabPane label="录屏回放" name="screencap" key="end-screencap">
               <Screencap v-if ="endDefault == 'screencap'" ></Screencap>
          </TabPane> -->
      <TabPane label="录屏回放" name="tab6" key="end-tab6" v-if="parsedVmInEnable">
        <screenController v-if="endDefault == 'tab6'" :poll="false"></screenController>
      </TabPane>
      <TabPane label="团队积分" name="adwTeamIntegral" key="end-adwTeamIntegral">
        <!--<Alert>提供的功能：提供参赛团队的有效积分排名，同时提供团队积分的计算和积分排名的导出。</Alert>-->
        <adwDrillIntegral
          v-if="endDefault == 'adwTeamIntegral'"
          :type="0"
          :sceneType="5"
          :hwType="hwType"
        ></adwDrillIntegral>
      </TabPane>
      <TabPane label="个人积分" name="adwUserIntegral" key="end-adwUserIntegral">
        <!--<Alert>提供的功能：提供参赛个人的有效积分排名，同时提供个人积分的计算和积分排名的导出。</Alert>-->
        <adwDrillIntegral
          v-if="endDefault == 'adwUserIntegral'"
          :type="1"
          :sceneType="5"
          :hwType="hwType"
        ></adwDrillIntegral>
      </TabPane>
      <!-- <TabPane label="云实例管理" name="cloudInstance" v-if="allowChangeIp" key="end-cloudInstance">
            <CloudInstance v-if="endDefault == 'cloudInstance'" :type="5" :disabledAllBtn="disabledAllBtn"></CloudInstance>
          </TabPane> -->
      <TabPane label="流量归档" name="trafficArchiving" key="end-trafficArchiving">
        <trafficArchiving v-if="endDefault == 'trafficArchiving'" />
      </TabPane>

      <TabPane
        label="外网分配管理"
        name="teamStatistics"
        v-if="allowChangeIp && vpn == '1211'"
        key="end-teamStatistics"
      >
        <teamStatistics
          v-if="endDefault == 'teamStatistics'"
          :type="5"
          :progress="this.drillDetail.progress"
          :disabledAllBtn="disabledAllBtn"
          :refreshdata="refeshNumber"
        ></teamStatistics>
      </TabPane>
      <TabPane
        label="外网操作统计"
        name="networkOperatingRecord"
        v-if="allowChangeIp && vpn == '1211'"
        key="end-networkOperatingRecord"
      >
        <newNetworkOperatingRecord
          v-if="endDefault == 'networkOperatingRecord'"
          :type="5"
          :disabledAllBtn="disabledAllBtn"
        ></newNetworkOperatingRecord>
      </TabPane>
      <TabPane
        v-if="showAsset"
        label="应用系统统计"
        name="applicationSystemStatistics"
        key="end-applicationSystemStatistics"
      >
        <assetStatistics
          :type="5"
          :useApiType="1"
          :hwType="hwType"
          :disabledAllBtn="disabledAllBtn"
          v-if="endDefault == 'applicationSystemStatistics'"
        />
      </TabPane>
      <TabPane v-if="showAsset" label="漏洞统计" name="vulnerabilityStatistics" key="end-vulnerabilityStatistics">
        <vulnerabilityStatistics
          :type="5"
          :disabledAllBtn="disabledAllBtn"
          v-if="endDefault == 'vulnerabilityStatistics'"
        />
      </TabPane>
    </Tabs>
    <Modal v-model="boardModal" title="发送公告" :width="650" footer-hide>
      <board v-if="boardModal" @hideModal="hideModal"></board>
    </Modal>
    <Modal
      v-model="sceneModal.show"
      :title="sceneModal.title"
      :loading="sceneModal.loading"
      :mask-closable="false"
      @on-ok="saveScene('formValidate')"
      @on-cancel="handleReset('formValidate')"
      :width="600"
    >
      <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">
        <FormItem label="时间" prop="Dates">
          <DatePicker
            :editable="false"
            type="datetimerange"
            :value="formValidate.Dates"
            format="yyyy-MM-dd HH:mm"
            placement="bottom-start"
            confirm
            ref="datePicker"
            placeholder="选择日期"
            style="width: 280px"
            transfer
            @on-ok="clickOkBtn"
            @on-clear="clickClearBtn"
            @on-open-change="switchOpenChange"
            @on-change="changeDates"
          ></DatePicker>
          <p style="color: #ff9900; font-size: 10px">
            选择同一天的时间段，请先双击要选择的日期
          </p>
        </FormItem>
      </Form>
    </Modal>
    <Modal
      v-model="sceneDelayModal.show"
      :title="sceneDelayModal.title"
      :loading="sceneDelayModal.loading"
      :mask-closable="false"
      @on-ok="saveSceneDelayTime('formValidate1')"
      @on-cancel="handleReset('formValidate1')"
      :width="600"
    >
      <Form ref="formValidate1" :model="formValidate" :rules="delayRuleValidate" :label-width="80">
        <FormItem label="结束时间" prop="endDate">
          <DatePicker
            :editable="false"
            type="datetime"
            v-model="formValidate.endDate"
            format="yyyy-MM-dd HH:mm"
            placement="bottom-start"
            placeholder="选择日期"
            style="width: 280px"
            transfer
            @on-change="changeEndDate"
          ></DatePicker>
        </FormItem>
      </Form>
    </Modal>
    <Modal v-model="tipModal.show" :title="tipModal.title" width="300" footer-hide>
      <h4>
        <Icon
          type="ios-loading"
          size="24"
          class="demo-spin-icon-load"
          style="margin-right: 24px"
        ></Icon
        >{{ tipModal.content }}
      </h4>
    </Modal>
    <Modal v-model="resetDetailModal.show" :title="resetDetailModal.title" width="800" footer-hide>
      <Button type="primary" ghost size="small" @click="rebuildAllFailVm" v-if="resetFail">
        <img
          src="../../assets/scene/dis-reset-network.png"
          alt=""
          style="vertical-align: middle"
        />重置所有重置失败节点
      </Button>
      <Table :columns="resetCol" :data="resetInfo.msgs" style="margin-top: 10px"></Table>
    </Modal>
    <Modal
      v-model="outerNetModal"
      :title="`配置外网ip（${chargeModeText}）`"
      :mask-closable="false"
      @on-visible-change="visibleChange"
      :width="600"
    >
      <Alert type="warning" show-icon>请提前半天或者一天开始配置</Alert>
      <Form ref="outerNetFrom" :model="outerNetFrom" :rules="outerNetRules" :label-width="190">
        <FormItem
          label="团队可重置的外网ip次数（次）"
          prop="switchNum"
          key="switchNum"
          v-if="outerNetFrom.showSwitchNum"
        >
          <Input v-model.trim="outerNetFrom.switchNum" number></Input>
        </FormItem>
        <FormItem
          label="带宽（M）"
          prop="maxBandwidth"
          key="maxBandwidth"
          v-if="outerNetFrom.showBandwidth"
        >
          <Input
            v-model.trim="outerNetFrom.maxBandwidth"
            number
            placeholder="带宽设置范围：1~10（M）"
            @on-change="getPrice"
          ></Input>
        </FormItem>
        <FormItem
          label="计时单位"
          prop="priceUnit"
          key="priceUnit"
          v-if="outerNetFrom.showBandwidth"
        >
          <RadioGroup v-model="outerNetFrom.priceUnit" @on-change="changePriceUnit">
            <Radio label="Day">日</Radio>
            <Radio label="Week">周</Radio>
            <Radio label="Month">月</Radio>
            <Radio label="Year">年</Radio>
          </RadioGroup>
        </FormItem>
        <FormItem
          :label="`时长（${unitText}）`"
          prop="period"
          key="period"
          v-if="outerNetFrom.showBandwidth"
        >
          <Select filterable v-model="outerNetFrom.period" @on-change="getPrice">
            <Option v-for="index of periodMaxNum" :value="index" :key="index">{{ index }}</Option>
          </Select>
        </FormItem>
        <FormItem
          label="总计"
          prop="totalPrices"
          key="totalPrices"
          v-if="outerNetFrom.showBandwidth"
        >
          <Input v-model="outerNetFrom.totalPrices" prefix="logo-yen" disabled />
        </FormItem>
      </Form>
      <div slot="footer">
        <Button @click="outerNetModal = false">取消</Button>
        <Button @click="saveOuterNet" type="primary" :loading="outerNetFrom.loading">确定</Button>
      </div>
    </Modal>
    <Modal
      v-model="reportTimeModal"
      :title="`修改靶标下线后${outerNetFrom.timeType == 'de' ? '防守方' : '攻击方'}可提交报告时长`"
      :mask-closable="false"
      :width="600"
    >
      <Form ref="reportTimeFrom" :model="outerNetFrom" :rules="outerNetRules" :label-width="60">
        <FormItem label="时长" prop="time">
          <InputNumber
            type="textarea"
            v-model.number="outerNetFrom.time"
            :min="1"
            :max="1000"
            :placeholder="'输入1~1000的整数'"
            style="width: 200px"
          ></InputNumber
          >（小时）
        </FormItem>
      </Form>
      <div slot="footer">
        <Button
          @click="
            $refs.reportTimeFrom.resetFields()
            reportTimeModal = false
          "
          >取消</Button
        >
        <Button @click="saveOuterNet('time')" type="primary" :loading="outerNetFrom.loading"
          >确定</Button
        >
      </div>
    </Modal>
    <Modal
      v-model="submitFrequencyModal.show"
      :loading="submitFrequencyModal.loading"
      @on-ok="saveSubmitFrequency"
      @on-cancel="closeSubmitFrequencyModal"
      title="修改提交频率"
      :mask-closable="false"
      :width="600"
    >
      <Form ref="submitFrequencyForm" :model="submitFrequencyForm" :rules="outerNetRules" inline>
        <span style="line-height: 32px">提交频率设置</span>
        <FormItem label=" " prop="submitTime" :label-width="34" key="submitTime">
          <div style="display: flex; align-items: center">
            <InputNumber
              v-model.number="submitFrequencyForm.submitTime"
              :min="1"
              :max="100"
              :placeholder="'输入1~100的整数'"
              style="width: 140px; border-radius: 4px 0 0 4px"
            >
            </InputNumber>
            <div class="input-append" style=""><span>分钟</span></div>
          </div>
        </FormItem>
        <FormItem label=" " prop="submitCount" :label-width="34" key="submitCount">
          <div style="display: flex; align-items: center">
            <InputNumber
              v-model.number="submitFrequencyForm.submitCount"
              :min="1"
              :max="100"
              :placeholder="'输入1~100的整数'"
              style="width: 140px; border-radius: 4px 0 0 4px"
            >
            </InputNumber>
            <div class="input-append" style=""><span>次</span></div>
          </div>
        </FormItem>
      </Form>
    </Modal>
    <Modal v-model="teamModal" title="修改团队公网ip数" :mask-closable="false" :width="600">
      <Form
        ref="teamNumberForm"
        :model="teamNumberForm"
        :rules="teamNumberRules"
        :label-width="100"
      >
        <FormItem label="团队公网ip数:" prop="count">
          <InputNumber
            type="textarea"
            v-model.number="teamNumberForm.count"
            :min="1"
            :max="1000"
            placeholder="输入团队公网ip数"
            style="width: 200px"
          ></InputNumber>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button @click="teamModal = false">取消</Button>
        <Button @click="handleIsoK()" type="primary" :loading="outerNetFrom.loading">确定</Button>
      </div>
    </Modal>
    <automation-step
      @on-window-state-change="windowStateChange"
      @finish="automationStepFinish"
      @on-config-suspend="configSuspend"
      :disabled="disabledAllBtn"
      :type="5"
      :hwType="hwType"
      :path="title"
    ></automation-step>
  </div>
</template>

<script>
import TargetTeam from '@/view/drill_compete/page/targetTeam/targetTeam-hwd.vue' //靶机
import RouterRules from '@/view/drill_compete/page/router-rules' // 路由规则最新的下发记录
import TargetAllot from '@/view/drill_compete/page/targetTeam/targetTeamAllot-hwd-230420.vue'
import AccessVmToUser from '@/view/drill_compete/page/accessVmToUser'
import Flow from '@/view/drill_compete/page/flow-new'
//import TargetTeamMid from '@/view/drill_compete/page/targetTeam/targetTeam-mid-new'
import FlagCommitOnce from '@/view/drill_compete/page/task_new/flagCommitOnce'
import Checker from '@/view/drill_compete/page/task_new/checker'
import FlagOutLoop from '@/view/drill_compete/page/task_new/flagOutLoop.vue'
import FlagVmOnce from '@/view/drill_compete/page/flagVmOnce'
import ReportCommitLoop from '@/view/drill_compete/page/reportCommitLoop'
import AccessUserToGroup from '@/view/drill_compete/page/accessUserToGroup'
import TargetExceptionLog from '@/view/drill_compete/page/targetExceptionLog'
import Protocol from '@/view/drill_compete/page/protocol.vue'
import QGAWrite from '@/view/drill_compete/page/qgaWrite/qgawrite.vue'
import teamRankStatic from '@/view/drill_compete/page/statistics/hwTeamRankStatic.vue'
import scoreRecordStatic from '@/view/drill_compete/page/statistics/scoreRecordStatic.vue'
import adwDrillIntegral from '@/view/drill_compete/page/statistics/awdDrillIntegral.vue'
import submitRecord from '@/view/drill_compete/page/statistics/submitRecord.vue'
import FlagOut from '@/view/drill_compete/page/task_new/flagOut.vue'
import DistributeRouter from '@/view/drill_compete/page/distributeRouter.vue'
import board from '@/components/board-cast/drillBoardcast.vue'
import reportStatic from '@/view/drill_compete/page/statistics/reportStatic.vue'
import topoTargetStatic from '@/view/drill_compete/page/statistics/topoTargetStatic.vue'
import assetStatistics from '@/view/drill_compete/page/statistics/assetStatistics.vue'
import vulnerabilityStatistics from '@/view/drill_compete/page/statistics/vulnerabilityStatistics.vue'
import EnvironManage from '@/view/drill_compete/page/environManage.vue'
import ChatRoom from '@/components/chatRoom/chatRoom'
import Screencap from '@/view/drill_compete/page/screencap.vue'
import AssignNetwork from '@/view/drill_compete/page/assign-network'
import teamStatistics from '@/view/drill_compete/page/teamStatistics'
import newNetworkOperatingRecord from '@/view/drill_compete/page/new-network-operating-record.vue'
import NetworkOperatingRecord from '@/view/drill_compete/page/network-operating-record.vue'
import AutomationStep from '@/components/automation-step/automation-step'
import ScoreRule from '@/view/drill_compete/page/hw/scoreRule'
import BasicScoreConfig from '@/view/drill_compete/page/basicScoreConfig'
import trafficCollection from '@/view/drill_compete/page/componentHW/trafficCollection'
import vpnManage from '@/view/drill_compete/page/componentHW/vpnManage'
import networkBehavior from '@/view/drill_compete/page/componentHW/networkBehavior'
import threatEvent from '@/view/drill_compete/page/componentHW/threatEvent'
import trafficRetrieval from '@/view/drill_compete/page/componentHW/trafficRetrieval'
import violations from '@/view/drill_compete/page/componentHW/violations'
import trafficArchiving from '@/view/drill_compete/page/componentHW/trafficArchiving'
// import CloudInstance from '@/view/drill_compete/page/cloud-instance'
import encryption from '@/libs/encryption.js'
import {
  getSceneInfo,
  updateSceneProgress,
  setSceneCycle,
  modifyScene,
  batchOpVm,
  batchOpVmLog,
  batchOpVmLogOnce,
  rebuildVm,
  setAmendTeamIpNumber
} from '@/api/drill_compete'
import { queryUsableNumber } from '@/api/teamStatistics'
import { clearProject } from '@/api/competition'
import { getTaskList, batchActiveTask, getstatusbyprjid } from '@/api/drill'
import { clearSceneNoticeAndChat } from '@/api/boardcast_new.js'
import timer from '@/mixin/timer'
import commonFun from './mixin.js'
import screenController from '@/view/drill_compete/page/screenController'
import recoverTime from '@/mixin/recoverTime'
import { parseJson } from '@/libs/utils'
import {
  getPrice,
  assigningPublicIP,
  getOperatingRecordList,
  allUnbundlePublicIP,
  updateBandwidth
} from '@/api/cloud'
import teamMixin from '@/mixin/groupMixin'
import destroyEnv from '@/mixin/destroyEnvironmentMixin'
import resetSceneMixin from '@/mixin/resetSceneMixin'

export default {
  name: 'newHwDetail',
  components: {
    teamStatistics,
    RouterRules,
    screenController,
    TargetTeam, //靶机--演练前
    TargetAllot,
    Flow, //流量过滤
    FlagCommitOnce, //flag单次提交
    Checker, //check任务
    FlagOutLoop, //
    FlagVmOnce, //Flag服务器配置
    ReportCommitLoop,
    AccessVmToUser, //（环境）接入机器
    AccessUserToGroup, //（演练用户管理）分配用户
    TargetExceptionLog, //目标异常日志,
    Protocol,
    QGAWrite,
    teamRankStatic,
    adwDrillIntegral, //排名统计,
    submitRecord, //提交统计
    FlagOut,
    board,
    reportStatic,
    scoreRecordStatic,
    topoTargetStatic,
    EnvironManage,
    ChatRoom,
    DistributeRouter,
    Screencap,
    AssignNetwork,
    newNetworkOperatingRecord,
    NetworkOperatingRecord,
    AutomationStep,
    ScoreRule, //计划规则
    BasicScoreConfig,
    trafficCollection, // 流量采集
    vpnManage, // vpn管理
    networkBehavior, // 网络行为
    threatEvent, // 威胁事件
    trafficRetrieval, // 流量检索
    violations, // 违规行为
    trafficArchiving, // 流量归档
    assetStatistics, // 资产统计
    vulnerabilityStatistics // 漏洞统计
  },
  mixins: [timer, commonFun, recoverTime, teamMixin, destroyEnv, resetSceneMixin],
  data() {
    let September = sessionStorage.getItem('November')
    September = JSON.parse(encryption.SelfUseDecrypt(September))
    const validateDelayDate = (rule, value, callback) => {
      //验证只能填入数字
      //var reg = new RegExp("^([1-9]|[1-9]\\d|100)$");
      //验证警戒值
      if (value) {
        if (new Date(value).getTime() - new Date(this.drillDetail.endTime).getTime() <= 0) {
          callback(new Error('选择的时间必须大于当前结束时间'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    const validateDate = (rule, value, callback) => {
      //验证只能填入数字
      //var reg = new RegExp("^([1-9]|[1-9]\\d|100)$");
      //验证警戒值
      if (value) {
        if (!this.formValidate.startTime || !this.formValidate.endTime) {
          callback(new Error('请选择时间'))
        } else if (
          new Date(this.formValidate.endTime).getTime() -
            new Date(this.formValidate.startTime).getTime() <
          60 * 60 * 1000
        ) {
          callback(new Error('起止时间最小间隔一个小时'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    const validateBandwidth = (rule, value, callback) => {
      // 带宽验证1~10
      if (value || value === 0) {
        if (Number.isInteger(value) && value >= 1 && value <= 10) {
          callback()
        } else {
          callback('带宽设置范围：1~10（M）')
        }
      } else {
        callback('不能为空')
      }
    }
    const validateSwitchNum = (rule, value, callback) => {
      // 可重置外网ip次数，正整数
      if (value || value === 0) {
        if (Number.isInteger(value) && value >= 1 && value <= 100) {
          callback()
        } else {
          callback('可重置的外网ip次数设置范围：1~100')
        }
      } else {
        callback('不能为空')
      }
    }

    const validateReportTime = (rule, value, callback) => {
      // 可重置外网ip次数，正整数
      if (value || value === 0) {
        if (Number.isInteger(value) && value >= 1 && value <= 1000) {
          callback()
        } else {
          callback('时长设置范围：1~1000的整数')
        }
      } else {
        callback('不能为空')
      }
    }

    const validateNum = (rule, value, callback) => {
      console.log('val', value)
      if (value !== 0 && !value) {
        callback(new Error('不能为空'))
      }
      if (!Number.isInteger(value)) {
        callback(new Error('请输入整数'))
      }
      if (value <= 0 || value > 100) {
        callback(new Error('请输入1-100的整数'))
      }
      callback()
    }
    return {
      teamIpNumber: this.$route.query.teamIpCount || 0,
      teamModal: false,
      usableNumber: 0,
      teamNumberForm: {
        count: 0
      },
      teamNumberRules: {
        count: [
          {
            required: true,
            type: 'number',
            message: '不能为空',
            trigger: 'change'
          },
          {
            min: 2,
            max: 100,
            type: 'number',
            message: '最小为2且不能大于100',
            trigger: 'change'
          }
        ]
      },
      configModeTitle: '是否切换至简单模式',
      autoConfigIsFinish: false,
      isWindowed: false,
      configIsSuspend: false,
      unitText: '日',
      periodMaxNum: 9,
      outerNetModal: false,
      reportTimeModal: false,
      outerNetFrom: {
        switchNum: 0,
        maxBandwidth: 0,
        priceUnit: 'Day',
        period: 1,
        time: 1,
        totalPrices: '',
        showSwitchNum: true,
        showBandwidth: true,
        timeType: '',
        loading: false
      },
      outerNetRules: {
        switchNum: [
          { required: true, type: 'number', message: '不能为空', trigger: 'change' },
          { validator: validateSwitchNum, trigger: 'change' }
        ],
        maxBandwidth: [
          { required: true, type: 'number', message: '不能为空', trigger: 'change' },
          { validator: validateBandwidth, trigger: 'change' }
        ],
        time: [
          { required: true, type: 'number', message: '不能为空', trigger: 'change' },
          { validator: validateReportTime, trigger: 'change' }
        ],
        priceUnit: [{ required: true, message: '不能为空', trigger: 'change' }],
        period: [{ required: true, type: 'number', message: '不能为空', trigger: 'change' }],
        submitTime: [
          { required: true, type: 'number', message: '不能为空', trigger: 'change,blur' },
          { validator: validateNum, trigger: 'change' }
        ],
        submitCount: [
          { required: true, type: 'number', message: '不能为空', trigger: 'change,blur' },
          { validator: validateNum, trigger: 'change' }
        ]
      },
      submitFrequencyForm: {
        submitCount: 1,
        submitTime: 1
      },
      USER_ID: September.userId,
      USER_Name: September.nickname,
      isRootDesigner: September.isRootDesigner,
      projectId: this.$route.query.prjid,
      drillid: this.$route.query.id,
      drillName: this.$route.query.name,
      drillDetail: {},
      testId: this.$route.query.id, //工程场景id
      currentIndex: 0,
      preCompeManagePanelShow: true,
      compeingManagePanelShow: false,
      compeedManagePanelShow: false,
      startContestStatus: false,
      stopContestStatus: false,
      preDefault: '',
      midDefault: '',
      endDefault: '',
      drillStatus: '',
      backObj: {
        path: '/hwDrill',
        name: 'hwDrill',
        meta: {
          requireAuth: true
        }
      },
      project: {
        drillitemname: this.$route.query.name,
        projectid: this.$route.query.prjid,
        drillitemid: this.$route.query.id,
        testId: this.$route.query.id
      },
      projectInfo: {},
      timeoutP: {},
      timeout: {},
      boardModal: false,
      compReportModal: false,
      sceneModal: {
        show: false,
        title: '修改时间',
        loading: true,
        type: 1,
        width: 550
      },
      sceneDelayModal: {
        show: false,
        title: '延迟比赛时间',
        loading: true,
        type: 1,
        width: 550
      },
      formValidate: {
        //      	"createTime":"2020-02-13T08:55:46.545Z",
        //      	"creator":"string",
        cycleTime: 1,
        description: '',
        endTime: '',
        extension: '',
        iconPath: '',
        id: '',
        name: '',
        progress: 0, // 0.准备中、1.准备完毕、2.开始中、3.裁判评判阶段、4.结束
        projectId: '',
        projectName: '',
        startTime: '',
        status: 1, //0 ：不启用 1：启用
        type: 0, //0.对抗演练、1.攻防赛、2夺旗赛、3知识赛、4渗透演练
        Dates: [],
        stMode: 0,
        endDate: ''
      },
      ruleValidate: {
        Dates: [
          { required: true, type: 'array', message: '不能为空', trigger: 'change' },
          { validator: validateDate, trigger: 'change' }
        ]
      },
      delayRuleValidate: {
        endDate: [
          //	          	{ required: true,message: '不能为空', trigger: 'change' },
          { validator: validateDelayDate, trigger: 'change' }
        ]
      },
      disabledDestroy: false,
      isScheme: 0,
      destoryTime: '',
      tipModal: {
        title: '提示',
        show: false,
        content: ''
      },
      queryOpLogInfo: {
        pageIndex: 1,
        pageSize: 10,
        projectId: this.$route.query.prjid,
        action: 'rebuild'
      },
      resetProgress: 0,
      resetInfo: {},
      resetStatus: 0,
      resetFail: false,
      resetDetailModal: {
        title: '重置详情',
        show: false
      },
      resetCol: [
        {
          title: '虚拟机名称',
          key: 'name'
        },
        {
          title: '实例名称',
          key: 'instanceName'
        },
        {
          title: '系统类型',
          key: 'sysType'
        },
        {
          title: '子网络名称',
          key: 'networkName'
        },
        {
          title: '镜像名称',
          key: 'imageName'
        },
        {
          title: '状态',
          key: 'errMsg',
          render: (h, params) => {
            return h(
              'Tag',
              {
                props: {
                  color: params.row.errMsg ? 'red' : 'green'
                }
              },
              params.row.errMsg ? '重置失败' : '重置成功'
            )
          }
        },
        {
          title: '错误信息',
          key: 'errMsg',
          render: (h, params) => {
            return h('span', params.row.errMsg || '无')
          }
        }
      ],
      hasOperatingRecord: true,
      showMonitoring: true, // 显示监控行为,
      trafficRetrievalParams: {
        //  网络行为切换到流量检索参数
        showFlag: false
      },
      submitFrequencyModal: {
        show: false,
        loading: true
      }
    }
  },
  provide() {
    return {
      parent: this
    }
  },
  filters: {
    //		filterMode(mode){
    //			if(mode == '2'){
    //				return '攻防对抗'
    //			}else if(mode == '1'){
    //				return '渗透攻击'
    //			}else{
    //				return '护网演练'
    //			}
    //		},
    //		typeFilter(val){
    //	        let str = '';
    //	        switch (val) {
    //	          case '1':str = '网络安全';break;
    //	          case '2':str = '软件安全';break;
    //	          case '3':str = '系统安全';break;
    //	          case '4':str = '数据安全';break;
    //	          default:break;
    //	        }
    //	        return str;
    //	     }
  },
  beforeDestroy() {
    clearTimeout(this.timeout)
    clearInterval(this.timeoutP)
    clearTimeout(this.setTimeInter)
  },
  beforeRouteLeave(to, from, next) {
    if (to.path === '/hwDrill') {
      //to.query.page = this.$route.query.page
      next()
    } else {
      //跳转至非护网页面，清空存储的查询条件
      sessionStorage.removeItem('queryObj')
      next()
    }
  },
  computed: {
    ipNumber() {
      return parseJson(this.drillDetail.extension).teamIpCount
    },
    parsedVmInEnable() {
      // const extension = JSON.parse( this.drillDetail&&this.drillDetail.extension)|| {}
      return parseJson(this.drillDetail.extension).vmInEnable
    },
    vpn() {
      let vpn = ''
      // const extension = JSON.parse( this.drillDetail&&this.drillDetail.extension)|| {}
      if (parseJson(this.drillDetail.extension).vpn1211 !== undefined) {
        vpn = '1211'
      }
      if (parseJson(this.drillDetail.extension).vpn1212 !== undefined) {
        vpn = '1212'
      }
      return vpn
    },
    hasTeam() {
      return this.teamList.length > 0
    },
    notOwn() {
      return this.USER_ID !== this.drillDetail.creator
    },
    extension() {
      return parseJson(this.drillDetail.extension)
    },
    targetScore() {
      return this.extension.targetScore || 5000
    },
    deployMode() {
      return this.extension.deployMode
    },
    allowChangeIp() {
      return this.extension.hwChangeIp === '1'
    },
    chargeModeText() {
      return this.extension.chargeMode === 1 ? '实时计费' : '包年包月'
    },
    switchNum() {
      return this.extension.switchNum || 0
    },
    atTime() {
      return this.extension.atTime || 2
    },
    deTime() {
      return this.extension.deTime || 24
    },
    submitTime() {
      return this.extension.submitTime || 1
    },
    submitCount() {
      return this.extension.submitCount || 1
    },
    switchNum() {
      return this.extension.switchNum || 0
    },
    maxBandwidth() {
      return this.extension.maxBandwidth || 0
    },
    disabledAllBtn() {
      return (
        this.projectInfo.status != 3 ||
        this.drillDetail.creator != this.USER_ID ||
        this.isWindowed ||
        this.configIsSuspend
      )
    },
    configMode() {
      return this.extension.configMode || 2
    },
    title() {
      //当前菜单显示名
      return this.$store.getters.pageTitle
    },
    routerName() {
      // 获取当前url 名
      return this.$route.name
    },
    hwType() {
      return 2
    }
  },
  watch: {
    drillStatus(val, oldVal) {
      if (val != oldVal && oldVal) {
        this.getDrillDetail(true, true)
      }
    },
    configMode: function(newValue) {
      if (newValue !== 2) {
        this.configModeTitle = '是否切换至复杂模式'
      } else {
        this.configModeTitle = '是否切换至简单模式'
      }
    },
    // 每次模态框展示时，将按钮设置为可点
    outerNetModal(val) {
      if (val) {
        this.outerNetFrom.loading = false
      }
    }
  },
  mounted() {
    this.getDictInfoByName() // 获取运维配置显示隐藏tab
    //	this.getDrillSecensLists();
    this.getDrillDetail(true, true).then((data) => {
      this.$store.commit('addBreadItem', { name: this.drillDetail.name })
      //判断是否可以开始比赛
      this.canStartCompete(this.drillDetail.type)
    })
    this.getProjectInfo()
    sessionStorage.removeItem('vmCurrentPage')
    this.getOperatingRecordList()
    setTimeout(() => {
      this.queryUsableNumber()
    }, 1000)
  },
  methods: {
    refeshNumber() {
      this.getDrillDetail()
      this.queryUsableNumber()
    },
    //进入环境
    handleGoCircumstances() {
      if (this.$store.state.common.sysConfig.modeConfig == '2') {
        this.$Message.info('未授权功能，请联系管理员')
      } else if (this.$store.state.common.sysConfig.modeConfig == 'jizhi2024') {
        window.open(
          `/14-topologyProject/index.html#/topologyDisplay/topologys?projectId=${this.$route.query.prjid}`
        )
      }
    },
    handleIsoK() {
      this.$refs.teamNumberForm.validate((isOk) => {
        if (isOk) {
          // this.getDrillDetail()
          setAmendTeamIpNumber(this.$route.query.id, this.teamNumberForm.count).then((data) => {
            if (data.code == 1) {
              this.$Message.info('新增成功')
              this.teamModal = false
              this.getDrillDetail()
              this.queryUsableNumber()
            } else {
              this.$Message.info(data.message)
            }
          })
        }
      })
    },
    queryUsableNumber() {
      if (parseJson(this.drillDetail.extension).vpn1211 !== undefined) {
        queryUsableNumber(this.$route.query.id).then((data) => {
          if (data.code == 1) {
            this.usableNumber = data.data
          }
        })
      }
    },
    // 网络行为切换到流量检索
    toTrafficRetrieval(row) {
      this.trafficRetrievalParams = row
      this.changeMidTab('trafficRetrieval')
    },
    changeConfigMode() {
      let extension = JSON.parse(this.formValidate.extension)
      let configMode = extension.configMode
      configMode = configMode !== 2 ? 2 : 1
      extension.configMode = configMode
      this.drillDetail.extension = JSON.stringify(extension)
      this.formValidate.extension = JSON.stringify(extension)
      let formValidate = {
        extension: this.formValidate.extension
      }
      this.modifyScene(this.formValidate.id, formValidate, 'changeConfigMode')
    },
    changEndClearConfig() {
      let data = { endClearConfig: this.endClearConfig ? 0 : 1 }
      this.modifyExtension(data, 'changeEndClearConfig')
    },
    modifyExtension(data, type) {
      let extension = JSON.parse(this.formValidate.extension)
      for (let key in data) {
        extension[key] = data[key]
      }
      let formValidate = { extension: JSON.stringify(extension) }
      this.modifyScene(this.formValidate.id, formValidate, type).then(() => {
        this.drillDetail.extension = JSON.stringify(extension)
      })
    },
    // 监控子组件是否处于窗口状态，需要通过这个状态太判断是否需要禁用按钮功能
    windowStateChange(state) {
      this.isWindowed = state
    },
    // 自动配置完成，放开窗口状态监控，检测是否可以开始比赛
    automationStepFinish() {
      this.isWindowed = false
      this.canStartCompete(this.drillDetail.type)
      // 需要重新获取团队列表，将管理员组刷新出来
      this.$refs.accessUserToGroup && this.$refs.accessUserToGroup.getAccessGroupList()
    },
    // 未自动配置
    configSuspend(state) {
      this.configIsSuspend = state
    },
    // 恢复暂停的比赛
    async restoreCompetition() {
      //加一个提示-bug15794
      this.tipModal.show = true
      this.tipModal.content = '正在恢复比赛...请稍后!!'
      await this.restoreCompetition_minixs(this.drillid) //方法在recoverTime混入中
      this.tipModal.show = false
    },
    // 暂停比赛
    pauseCompetition() {
      //加一个提示-bug15794
      this.tipModal.show = true
      this.tipModal.content = '正在暂停比赛...请稍后!!'
      this.changeCompetitionStatus(5, '暂停')
    },
    changePreDefault(val) {
      this.preDefault = val
    },
    // 查询外网IP分配记录，判断是否禁用一键分配功能
    getOperatingRecordList() {
      getOperatingRecordList({
        pageIndex: 1,
        pageSize: 10,
        sceneId: this.$route.query.id
      }).then(({ code, message, data }) => {
        if (code !== 1) {
          this.$Message.warning(message)
          return
        }
        this.hasOperatingRecord = data.total !== 0
      })
    },
    // 修改计时单位
    changePriceUnit(val) {
      switch (val) {
        case 'Day':
          this.unitText = '日'
          this.periodMaxNum = 9
          break
        case 'Week':
          this.unitText = '周'
          this.periodMaxNum = 4
          break
        case 'Month':
          this.unitText = '月'
          this.periodMaxNum = 9
          break
        case 'Year':
          this.unitText = '年'
          this.periodMaxNum = 5
          break
      }
      this.$set(this.outerNetFrom, 'period', 1)
      this.getPrice()
    },
    // 计算金额
    getPrice() {
      let { maxBandwidth } = this.outerNetFrom
      if (Number.isInteger(maxBandwidth) && maxBandwidth > 0 && maxBandwidth <= 10) {
        this.outerNetFrom.totalPrices = '计算中...'
        this.outerNetFrom.loading = true
        getPrice(this.outerNetFrom)
          .then(({ code, data, message }) => {
            if (code === 0) {
              this.$Message.warning(message || '计算金额失败')
              this.outerNetFrom.totalPrices = 'infinity'
              return
            }
            this.outerNetFrom.totalPrices = data.price.tradePrice
          })
          .catch(() => {
            this.$Message.error('计算金额异常')
            this.outerNetFrom.totalPrices = 'infinity'
          })
          .finally(() => {
            this.outerNetFrom.loading = false
          })
      } else {
        this.outerNetFrom.totalPrices = ''
      }
    },
    getProjectInfo() {
      if (!this.$route.query.prjid) {
        return
      }
      this.disabledDestroy = false
      getstatusbyprjid(this.$route.query.prjid).then((data) => {
        if (data.code == 1) {
          this.projectInfo = data.attribute.project
          this.project = data.attribute
          if (
            this.projectInfo.status == 0 ||
            this.projectInfo.status == 10 ||
            this.projectInfo.status == 14
          ) {
            clearInterval(this.timeoutP)
          }
        } else if (data.code == -2) {
          this.projectInfo.statusCHName = '工程不存在'
          this.disabledDestroy = true
        } else {
          this.$Message.error(data.message)
        }
      })
    },
    getDrillDetail(needChangeStep, needServiceTime, setParams) {
      //是否需要切换步骤,是否需要服务时间请求
      return new Promise((resolve, reject) => {
        getSceneInfo(this.drillid).then((data) => {
          let startTimeChange = false
          let endTimeChange = false
          if (data.data.startTime != this.drillDetail.startTime) {
            startTimeChange = true
          }
          if (data.data.endTime != this.drillDetail.endTime) {
            endTimeChange = true
          }
          this.drillDetail = data.data
          this.teamNumberForm.count = JSON.parse(this.drillDetail.extension).teamIpCount
          if (JSON.parse(this.drillDetail.extension).isScheme) {
            // 判断是否是黄方下发的任务
            this.isScheme = JSON.parse(this.drillDetail.extension).isScheme
          }

          this.destoryTime = new Date(this.drillDetail.endTime).getTime() + 24 * 60 * 60 * 1000
          if (setParams == 'setEndDate') {
            this.formValidate.endDate = data.data.endTime
          }
          this.formValidate = Object.assign(this.formValidate, data.data)
          this.formValidate.Dates = [this.formValidate.startTime, this.formValidate.endTime]
          if (this.drillDetail.progress == 0 || this.drillDetail.progress == 1) {
            if (needChangeStep) {
              this.toPreCompeManage()
            }
            if (needServiceTime || startTimeChange) {
              if (this.timeout) {
                clearTimeout(this.timeout)
              }
              this.getServeTime(new Date(this.drillDetail.startTime).getTime())
            }
            this.drillStatus = 1
            this.startContestStatus = false
            this.stopContestStatus = true
          } else if (
            this.drillDetail.progress == 2 ||
            this.drillDetail.progress == 3 ||
            this.drillDetail.progress == 5
          ) {
            if (needChangeStep) {
              this.toCompeingManage()
            }
            if (needServiceTime || endTimeChange) {
              if (this.timeout) {
                clearTimeout(this.timeout)
              }
              this.getServeTime(new Date(this.drillDetail.endTime).getTime())
            }
            this.drillStatus = 2
            this.startContestStatus = true
            this.stopContestStatus = false
          } else if (this.drillDetail.progress == 4) {
            if (needChangeStep) {
              this.toCompeedManage()
            }
            if (needServiceTime || endTimeChange) {
              if (this.timeout) {
                clearTimeout(this.timeout)
              }
              this.getServeTime(new Date(this.drillDetail.endTime).getTime())
            }
            this.drillStatus = 3
            this.startContestStatus = true
            this.stopContestStatus = true
          }
          resolve()
        })
      })
    },
    visibleChange(type) {
      if (type) {
        this.outerNetFrom = Object.assign(this.outerNetFrom, {
          switchNum: this.switchNum,
          maxBandwidth: this.maxBandwidth,
          time: this.timeType == 'at' ? this.atTime : this.deTime
        })
        this.getPrice()
      } else {
        this.$refs['outerNetFrom'].resetFields()
        this.unitText = '日'
      }
    },
    openSubmitFrequencyModal() {
      this.submitFrequencyModal.show = true
      this.submitFrequencyForm.submitTime = this.submitTime || 1
      this.submitFrequencyForm.submitCount = this.submitCount || 1
    },
    closeSubmitFrequencyModal() {
      this.$refs.submitFrequencyForm.resetFields()
    },
    saveSubmitFrequency() {
      this.$refs['submitFrequencyForm']
        .validate((valid) => {
          if (valid) {
            this.extension.submitTime = this.submitFrequencyForm.submitTime
            this.extension.submitCount = this.submitFrequencyForm.submitCount
            let extensionJson = JSON.stringify(this.extension)
            this.$set(this.drillDetail, 'extension', extensionJson)
            modifyScene(this.drillDetail.id, { extension: extensionJson })
              .then(({ code, message }) => {
                if (code !== 1) {
                  this.$Message.error(message)
                  return
                }
                this.$Message.info('修改提交频率成功')
                this.submitFrequencyModal.show = false
              })
              .catch(() => {
                console.log(error)
              })
              .finally(() => {
                this.submitFrequencyModal.loading = false
                setTimeout(() => {
                  this.submitFrequencyModal.loading = true
                })
              })
          } else {
            this.submitFrequencyModal.loading = false
            setTimeout(() => {
              this.submitFrequencyModal.loading = true
            })
          }
        })
        .catch((error) => {
          this.submitFrequencyModal.loading = false
          setTimeout(() => {
            this.submitFrequencyModal.loading = true
          })
        })
    },
    saveOuterNet(type) {
      this.$refs[type == 'time' ? 'reportTimeFrom' : 'outerNetFrom'].validate((valid) => {
        if (valid) {
          this.outerNetFrom.loading = true
          if (this.outerNetFrom.showSwitchNum) {
            this.extension.switchNum = this.outerNetFrom.switchNum
          }
          if (this.outerNetFrom.showBandwidth) {
            this.extension.maxBandwidth = this.outerNetFrom.maxBandwidth
          }
          if (type == 'time') {
            if (this.outerNetFrom.timeType === 'at') {
              this.extension.atTime = this.outerNetFrom.time
            } else {
              this.extension.deTime = this.outerNetFrom.time
            }
          }
          let extensionJson = JSON.stringify(this.extension)
          this.$set(this.drillDetail, 'extension', extensionJson)
          modifyScene(this.drillDetail.id, { extension: extensionJson })
            .then(({ code, message }) => {
              if (code !== 1) {
                this.$Message.warning(message)
                this.outerNetFrom.loading = false
                return
              }
              if (type == 'time') {
                this.outerNetFrom.loading = false
                this.$Message.info(
                  `修改靶标下线后${
                    this.outerNetFrom.timeType == 'de' ? '防守方' : '攻击方'
                  }可提交报告时长成功`
                )
                this.reportTimeModal = false
                return
              }
              if (this.outerNetFrom.showBandwidth) {
                // 修改带宽，需要同步配置外网
                if (this.outerNetFrom.showSwitchNum) {
                  // 同步设置团队可重置的外网ip次数时，是第一次设置，需要分配IP
                  assigningPublicIP(
                    this.$route.query.id,
                    this.$route.query.prjid,
                    this.teamList.map((item) => {
                      return {
                        teamId: item.id,
                        teamName: item.name,
                        partyId: item.partyId
                      }
                    })
                  )
                    .then(({ code, message }) => {
                      if (code !== 1) {
                        this.$Message.warning(message)
                        this.outerNetFrom.loading = false
                        return
                      }
                      this.preDefault = 'assignNetwork'
                      this.$Message.info('配置外网ip成功')
                      this.outerNetModal = false
                      this.hasOperatingRecord = true
                    })
                    .catch(() => {
                      this.outerNetFrom.loading = false
                      this.$Message.error('自动分配外网IP异常')
                    })
                } else {
                  // 只是修改带宽
                  updateBandwidth(this.$route.query.prjid, this.outerNetFrom.maxBandwidth)
                    .then(({ code, message }) => {
                      if (code !== 1) {
                        this.$Message.warning(message)
                        this.outerNetFrom.loading = false
                        return
                      }
                      this.$Message.info('修改公网带宽成功')
                      this.outerNetModal = false
                    })
                    .catch(() => {
                      this.outerNetFrom.loading = false
                      this.$Message.error('修改公网带宽异常')
                    })
                }
              } else {
                // 未修改带宽
                this.$Message.info('修改团队可重置的外网ip次数成功')
                this.outerNetModal = false
              }
            })
            .catch(() => {
              this.outerNetFrom.loading = false
            })
        }
      })
    },
    handleReset(name) {
      this.$refs[name].resetFields()
      this.iconSrc = ''
      this.formValidate.iconPath = ''
      //      if(name=='assignePeople'){
      //        this.assignePeople = false;
      //      }
    },
    cancelLoading(modal) {
      modal.loading = false
      setTimeout(() => {
        modal.loading = true
      })
    },
    showModal() {
      this.sceneModal.show = true
      this.sceneModal.type = '2'
      this.getDrillDetail()
    },
    saveScene(name) {
      console.log(this.formValidate)
      this.$refs[name].validate((valid) => {
        if (valid) {
          let data = JSON.parse(JSON.stringify(this.formValidate))
          if (new Date(data.startTime).getTime() > new Date(data.endTime).getTime()) {
            this.$Message.error('表单输入有误，开始时间不能大于结束时间!')
            this.cancelLoading(this.sceneModal)
            return
          }
          //	            let reg = new RegExp("((([0-9]{3}[1-9]|[0-9]{2}[1-9][0-9]{1}|[0-9]{1}[1-9][0-9]{2}|[1-9][0-9]{3})-(((0[13578]|1[02])-(0[1-9]|[12][0-9]|3[01]))|((0[469]|11)-(0[1-9]|[12][0-9]|30))|(02-(0[1-9]|[1][0-9]|2[0-8]))))|((([0-9]{2})(0[48]|[2468][048]|[13579][26])|((0[48]|[2468][048]|[3579][26])00))-02-29))\s([0-1][0-9]|2[0-3]):([0-5][0-9]):([0-5][0-9])$");
          //	            if(!reg.test(data.startTime) || !reg.test(data.endTime)){
          //	            	this.cancelLoading(this.sceneModal);
          //	            	this.$Message.error('时间格式错误');
          //	      			return;
          //	            }
          delete data.Dates
          this.modifyScene(data.id, data, 'restart')
        } else {
          this.$Message.error('表单输入有误，请查看页面信息后重新输入!')
          this.cancelLoading(this.sceneModal)
        }
      })
    },
    saveSceneDelayTime(name) {
      this.$refs[name].validate((valid) => {
        if (valid) {
          let data = JSON.parse(JSON.stringify(this.formValidate))
          //	            let reg = new RegExp("((([0-9]{3}[1-9]|[0-9]{2}[1-9][0-9]{1}|[0-9]{1}[1-9][0-9]{2}|[1-9][0-9]{3})-(((0[13578]|1[02])-(0[1-9]|[12][0-9]|3[01]))|((0[469]|11)-(0[1-9]|[12][0-9]|30))|(02-(0[1-9]|[1][0-9]|2[0-8]))))|((([0-9]{2})(0[48]|[2468][048]|[13579][26])|((0[48]|[2468][048]|[3579][26])00))-02-29))\s([0-1][0-9]|2[0-3]):([0-5][0-9]):([0-5][0-9])$");
          //	            if(!reg.test(data.startTime) || !reg.test(data.endTime)){
          //	            	this.cancelLoading(this.sceneModal);
          //	            	this.$Message.error('时间格式错误');
          //	      			return;
          //	            }
          delete data.Dates
          data.endTime = data.endDate
          delete data.endDate
          this.modifyScene(data.id, data, 'delay')
        } else {
          this.$Message.error('表单输入有误，请查看页面信息后重新输入!')
          this.cancelLoading(this.sceneDelayModal)
        }
      })
    },
    modifyScene(id, data, type) {
      return new Promise((resolve, reject) => {
        modifyScene(id, data)
          .then((data) => {
            if (data.code == 1) {
              //this.$Message.info('修改演练场景成功');
              this.sceneModal.show = false
              this.sceneDelayModal.show = false
              if (type == 'delay') {
                this.$Message.info('延迟成功')
                setTimeout(() => {
                  this.getDrillDetail(false, true)
                }, 2000)
              } else if (type === 'changeConfigMode') {
                this.$Message.info('模式切换成功')
              } else if (type === 'changeEndClearConfig') {
                this.$Message.info('切换结束后是否销毁环境成功')
              } else {
                if (type == 'restart') {
                  this.$Message.info('重新开始演练成功')
                }
                setTimeout(() => {
                  this.getDrillDetail()
                }, 2000)
              }
              resolve()
            } else {
              this.cancelLoading(this.sceneModal)
              this.cancelLoading(this.sceneDelayModal)
              this.$Message.warning(data.message)
              reject()
            }
          })
          .catch((error) => {
            this.cancelLoading(this.sceneModal)
            this.cancelLoading(this.sceneDelayModal)
            this.$Message.error(error)
            reject()
          })
      })
    },
    timeChange(timeArr) {
      if (timeArr.length > 0) {
        this.formValidate.startTime = timeArr[0] ? timeArr[0] + ':00' : ''
        this.formValidate.endTime = timeArr[1] ? timeArr[1] + ':00' : ''
      }
    },
    changePreTab(name) {
      this.preDefault = name
      if (name == 'accessUser') {
      }
      //			if(name == 1){
      //				this.getProjectGroupMember();
      //			}else if(name == 2){
      //				this.getUserTaskList();
      //			}else{
      //				this.getAccessGroupList();
      //			}
    },
    changePreTab(name) {
      this.preDefault = name
      if (name == 'accessUser') {
      }
      //			if(name == 1){
      //				this.getProjectGroupMember();
      //			}else if(name == 2){
      //				this.getUserTaskList();
      //			}else{
      //				this.getAccessGroupList();
      //			}
    },
    changeMidTab(name) {
      if (name !== 'trafficRetrieval') {
        this.trafficRetrievalParams = {
          //  网络行为切换到流量检索参数
          showFlag: false
        }
      }
      this.midDefault = name

      if (name == 'accessUser') {
      }
      //			if(name == 1){
      //				this.getProjectGroupMember();
      //			}else if(name == 2){
      //				this.getUserTaskList();
      //			}else{
      //				this.getAccessGroupList();
      //			}
    },
    changeEndTab(name) {
      this.endDefault = name
      if (name == 'accessUser') {
      }
      //			if(name == 1){
      //				this.getProjectGroupMember();
      //			}else if(name == 2){
      //				this.getUserTaskList();
      //			}else{
      //				this.getAccessGroupList();
      //			}
    },
    initPane() {
      this.preDefault = 'accessGroup'
      this.midDefault = 'targetTeamMid'
      this.endDefault = 'adwRankingStatic'
    },
    toPreCompeManage() {
      //演练前设置页面
      this.preDefault = 'accessGroup'
      this.midDefault = ''
      this.endDefault = ''
      this.currentIndex = 0
      setTimeout(() => {
        this.preCompeManagePanelShow = true
        this.compeingManagePanelShow = false
        this.compeedManagePanelShow = false
      })
    },
    toCompeingManage() {
      //演练中
      if (this.drillDetail.progress == 0 || this.drillDetail.progress == 1) {
        return
      }
      this.preDefault = ''
      this.midDefault = 'targetAttackAllotStatic'
      this.endDefault = ''
      this.currentIndex = 1
      setTimeout(() => {
        this.preCompeManagePanelShow = false
        this.compeingManagePanelShow = true
        this.compeedManagePanelShow = false
      })
    },
    toCompeedManage() {
      console.log(this.drillDetail.progress)
      //演练后
      if (this.drillDetail.progress != 4) {
        return
      }
      this.preDefault = ''
      this.midDefault = ''
      this.endDefault = 'teamRankStatic'
      this.currentIndex = 2
      setTimeout(() => {
        this.preCompeManagePanelShow = false
        this.compeingManagePanelShow = false
        this.compeedManagePanelShow = true
      })
    },
    changeCompetitionStatus(status, op) {
      updateSceneProgress(this.drillid, status)
        .then((data) => {
          if (data.code == 1) {
            this.$Message.info(`${op}成功`)
            this.tipModal.show = false
            this.getDrillDetail()
            if (status == 2) {
              //this.setSceneCycle();
            }
            if (status === 5 && this.allowChangeIp && this.hasOperatingRecord) {
              // 允许切换IP并且存在绑定数据时，停止比赛需要提示是否需要释放公有云资源
              this.$Modal.confirm({
                title: '释放资源',
                content: '演练已暂停，是否同步释放外网地址，如不释放，将持续产生费用',
                onOk: () => {
                  this.allUnbundlePublicIP()
                },
                onCancel: () => {}
              })
            }
          } else {
            this.$Message.error(data.message)
            this.tipModal.show = false
          }
        })
        .catch((error) => {
          this.$Message.error(error.message)
          this.tipModal.show = false
        })
    },
    // 释放外网地址
    allUnbundlePublicIP() {
      allUnbundlePublicIP(this.$route.query.prjid)
        .then(({ code, message }) => {
          if (code !== 1) {
            this.$Message.warning(message)
            return
          }
          this.$Message.info('释放外网地址成功，请在恢复演练前半小时重新分配外网地址')
        })
        .catch(() => {
          this.$Message.error('释放放外网地址异常')
        })
    },
    validateStart() {
      this.canStartCompete(this.drillDetail.type).then((data) => {
        this.$Message.info('校验完成')
      })
    },
    getTaskList(status) {
      if (status == 2) {
        this.canStartCompete(this.drillDetail.type).then((data) => {
          if (!data) {
            this.$Message.warning('请检查团队成员配置及目标分配是否完成')
            return
          } else {
            this.opTaskListNew(status)
          }
        })
        this.tipModal.content = '正在开始演练...请稍后!!'
      } else {
        this.tipModal.content = '正在停止演练...请稍后!!'
        this.opTaskListNew(status)
      }
    },
    opTaskListNew(status) {
      this.tipModal.show = true
      let str
      if (status == 2) {
        //开始
        str = 'start'
      } else {
        str = 'stop'
      }
      let params = {
        sceneId: this.$route.query.id,
        taskMode: 'preset',
        op: str
      }
      this.changeCompetitionStatus(status, status == 2 ? '开始' : '结束')
    },
    opTaskList(status) {
      if (status == 2) {
        this.tipModal.content = '正在开始比赛...请稍后!!'
      } else {
        this.tipModal.content = '正在停止比赛...请稍后!!'
      }
      this.tipModal.show = true
      let opTask = []
      //flag单次提交任务
      //	    	let params1 = {
      //	    		"testId":this.$route.query.id,
      //              "page":1,
      //              "rows":10000,
      //              "taskType":'once_submit_flag',
      //              "taskMode":"preset"
      //	    	}
      let str, condition
      if (status == 2) {
        //开始
        str = 'start'
      } else {
        str = 'stop'
      }
      //	    	let p1 = new Promise((resolve,reject) => {
      //	    		getTaskList(params1).then(data => {
      //		    		if(data.code == 1){
      //		    			let taskList = data.data.items;
      //		    			taskList.forEach(task => {
      //		    				if(status == 2){
      //			    				//if(task.status == 'initialized'){
      //			    					opTask.push({
      //			    						"operation": str,
      //		    							"taskId": task.id
      //			    					})
      //			    				//}
      //			    			}else if(status == 4){
      //			    				if(task.status == 'running'){
      //			    					opTask.push({
      //			    						"operation": str,
      //		    							"taskId": task.id
      //			    					})
      //			    				}
      //			    			}
      //		    			})
      //		    			resolve();
      //		    		}
      //		    	})
      //	    	})
      //报告持续提交
      let params1 = {
        testId: this.$route.query.id,
        page: 1,
        rows: 10000,
        taskType: 'loop_report',
        taskMode: 'preset'
      }
      let p1 = new Promise((resolve, reject) => {
        getTaskList(params1).then((data) => {
          if (data.code == 1) {
            let taskList = data.data.items
            taskList.forEach((task) => {
              if (status == 2) {
                if (task.status == 'initialized' || task.status == 'completed') {
                  opTask.push({
                    operation: str,
                    taskId: task.id
                  })
                }
              } else if (status == 4) {
                if (task.status == 'running') {
                  opTask.push({
                    operation: str,
                    taskId: task.id
                  })
                }
              }
            })
            resolve()
          }
        })
      })
      Promise.all([p1]).then((data) => {
        console.log(opTask)
        this.activeTask(opTask).then((data) => {
          this.changeCompetitionStatus(status, status == 2 ? '开始' : '结束')
        })
      })
    },
    activeTask(tasks) {
      let $this = this
      //          if(active=="开始"){
      //              active = "start"
      //          }else if(active=="停止"){
      //              active = "stop"
      //          }
      //          axios({
      //              url:this.GLOBAL._projPath_process +"custom/tasks/"+taskId+'/execute?operation='+active,
      //              method:'post'
      //          }).
      return new Promise((resolve, reject) => {
        if (tasks.length == 0) {
          resolve()
        }
        batchActiveTask(tasks).then((response) => {
          let activeType
          if (response.code == 1) {
            if (response.data.length > 0 && response.data.some((task) => task.code == 0)) {
              response.data.forEach((task) => {
                if (task.code == 0) {
                  $this.$Message.warning(task.message)
                }
              })
            } else {
            }
            resolve()
          } else {
            $this.$Message.error(response.message)
          }
        })
      })
    },
    //添加场景周期
    setSceneCycle() {
      setSceneCycle(this.drillid).then((data) => {
        if (data.code == 1) {
          console.log(data.message)
        } else {
          this.$Message.warning(data.message)
        }
      })
    },
    //释放资源
    clearProject() {
      this.disabledDestroy = true
      clearProject(this.$route.query.prjid)
        .then((data) => {
          if (data.code == 1 || data.code == 3) {
            this.$Message.info('环境清空中...')
            clearInterval(this.timeoutP)
            this.timeoutP = setInterval((data) => {
              this.getProjectInfo()
            }, 3000)
          } else {
            this.$Message.warning(data.message)
          }
          this.disabledDestroy = false
        })
        .catch((error) => {
          this.disabledDestroy = false
        })
    },
    showVisualization() {
      let oToken = localStorage.getItem('token')
      //         window.open(
      //          `http://172.18.100.1/three.test/paGame.html?contestId=${this.$route.query.id}&token=${oToken}&projectId=${this.$route.query.prjid}`,
      //          '_black')
      window.open(
        `${window.location.origin}/visualSystem/protectNet.html?contestId=${this.$route.query.id}&token=${oToken}`
      )
      //			window.open(`/three.test/d7.html?projectId=${this.$route.query.prjid}&token=${oToken}`)
    },
    showVisualization1() {
      let oToken = localStorage.getItem('token')
      //         window.open(
      //          `http://172.18.100.1/three.test/paGame.html?contestId=${this.$route.query.id}&token=${oToken}&projectId=${this.$route.query.prjid}`,
      //          '_black')
      let title = this.title + '可视化大屏'
      // window.open(`/huwang?sceneId=${this.$route.query.id}&token=${oToken}&title=${title}`);
      window.open(
        `${window.location.origin}/huwang/?sceneId=${this.$route.query.id}&token=${oToken}&title=${title}`
      )
      //			window.open(`/three.test/d7.html?projectId=${this.$route.query.prjid}&token=${oToken}`)
    },
    hideModal() {
      this.boardModal = false
    },
    destoryProject() {
      return (
        this.disabledDestroy ||
        !this.startContestStatus ||
        !this.stopContestStatus ||
        !(this.projectInfo.status == 3 || this.projectInfo.status == 14)
      )
    },
    returnPage() {
      this.$router.push(this.backObj)
    },
    gotoReportPage() {
      const { href } = this.$router.resolve({
        name: 'hwReport',
        query: {
          id: this.$route.query.id,
          type: 5
        }
      })
      window.open(href, '_blank')
    },

    // 离线流量分析
    gotoFlowAnalysis() {
      this.$router.push({
        name: 'flowAnalysis',
        query: {
          sceneName: '离线流量分析',
          name: this.$route.query.name,
          prjid: this.$route.query.prjid,
          id: this.$route.query.id,
          page: this.$route.query.page
        }
      })
    },
    resetEnviron() {
      this.tipModal.show = true
      this.tipModal.content = '正在重置环境...请稍后!!'
      batchOpVm(this.projectId, 'rebuild')
        .then((data) => {
          if (data.code == 1) {
            this.$Message.info('操作成功')
            this.batchOpVmLog()
          } else {
            this.$Message.error(data.message)
          }
          this.tipModal.show = false
        })
        .catch((error) => {
          this.$Message.error('环境重置失败')
          this.tipModal.show = false
        })
    },
    batchOpVmLog(isFirst) {
      batchOpVmLog(this.queryOpLogInfo)
        .then((data) => {
          if (data.code == 1) {
            if (data.data.items.length > 0) {
              //重置过
              let id = data.data.items[0].id
              this.batchOpVmLogDetail(id, isFirst)
            } else {
              //未重置
              this.resetStatus = 0
            }
          } else {
            this.$Message.error(data.messsage)
          }
        })
        .catch((error) => {
          this.$Message.error('查询重置详情失败')
        })
    },
    batchOpVmLogDetail(id, isFirst) {
      batchOpVmLogOnce(id)
        .then((data) => {
          if (data.code == 1) {
            this.resetInfo = data.data
            this.resetInfo.finished = this.resetInfo.finished || 0
            this.resetProgress = parseInt((this.resetInfo.finished / this.resetInfo.total) * 100)
            if (this.resetInfo.finished == this.resetInfo.total) {
              this.resetStatus = 2 // 重置完成
              if (this.resetInfo.msgs.filter((item) => item.errMsg).length > 0) {
                this.resetFail = true
                if (!isFirst) {
                  this.$Message.error('重置失败')
                }
              } else {
                this.resetFail = false
                if (!isFirst) {
                  this.$Message.info('重置成功')
                }
              }
            } else if (this.resetInfo.finished < this.resetInfo.total) {
              this.resetStatus = 1 //重置中
            }
            if (this.resetStatus != 2) {
              setTimeout(() => {
                this.batchOpVmLogDetail(id)
              }, 2000)
            }
          } else {
            this.$Message.error(data.messsage)
          }
        })
        .catch((error) => {
          this.$Message.error('查询重置详情失败')
        })
    },
    getResetDetail() {
      this.resetDetailModal.show = true
    },
    rebuildAllFailVm() {
      this.tipModal.show = true
      this.tipModal.content = '正在重置环境...请稍后!!'
      let proArr = this.resetInfo.msgs
        .filter((item) => item.errMsg)
        .map(async (vm) => {
          await this.rebuildVm(vm.id)
        })
      Promise.all(proArr)
        .then((data) => {
          this.tipModal.show = false
          this.$Message.info('重置完成')
        })
        .catch((error) => {
          this.$Message.info('重置失败')
        })
    },
    rebuildVm(id) {
      return new Promise((resolve, reject) => {
        rebuildVm(id)
          .then((data) => {
            if (data.code == 1) {
              resolve(data)
            } else {
              reject()
            }
          })
          .catch((error) => {
            reject()
            //this.$Message.error('重置【'+vm.name+'】失败');
          })
      })
    },
    showDelayModal() {
      this.sceneDelayModal.show = true
      this.getDrillDetail('', '', 'setEndDate')
    },
    changeEndDate(time) {
      this.formValidate.endDate = time + ':00'
    },
    clearSceneNoticeAndChat() {
      const msg = this.$Message.loading({
        content: '正在清空...',
        duration: 0,
        closable: true
      })
      let sceneId = this.$route.query.id
      clearSceneNoticeAndChat(sceneId)
        .then((data) => {
          setTimeout(msg, 1000)
          setTimeout(() => {
            if (data.code == 1) {
              this.$Message.info('清空成功')
              this.$refs['chatRoom'].clearChatMsg()
            } else {
              this.$Message.info('清空失败')
            }
          }, 1100)
        })
        .catch((error) => {
          setTimeout(msg, 1000)
          setTimeout(() => {
            this.$Message.info('清空失败')
          }, 1100)
        })
    },
    //护网下载统计信息
    downloadReport(scene) {
      let sceneId = this.drillDetail.id
      let sceneName = this.drillDetail.name
      let href = `/api/compete/scoring/exportReport/${sceneId}/${sceneName}`
      let a = document.createElement('a')
      document.body.appendChild(a)
      a.href = href
      a.download = '' //命名下载名称
      a.click() //点击触发下载
      a.remove()
    }
  }
}
</script>
<style scoped src="./detail.css"></style>
